@import "../../../../frameless";

#view {
    @media #{$medium-and-smaller} {
        margin-top: 100px;
    } 

    @media #{$intermediate-and-smaller} {
        text-align: left;
    }   
}

.details {
    width: $cols8;

    &.inner {
        margin-top: 2rem;

        &.fetching {
            opacity: .6;
        }
    }

    .back {
        margin: 1rem 0;
    }

    ul {
        &.logistics {
            margin: .25rem 0 2.5rem;
            padding-left: 0;
            list-style-type: none;
        }

        li {
            margin: .25rem 0;

            img {
                margin-right: .5rem;
                width: 1rem;
                height: 1rem;
            }
        }
    }

    .description {
        margin: 2rem 0;
    }
}

//8 columns
@media #{$intermediate-and-smaller} {
    .details {
        width: 100%;
    }
}
